<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>结果页</title>

    <!-- Google Font: Source Sans Pro -->
    <!--  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">-->
    <!-- Font Awesome -->
    <link rel="stylesheet" href={{ url_for(
    'static', filename='plugins/fontawesome-free/css/all.min.css') }}>
    <!-- Theme style -->
    <link rel="stylesheet" href={{ url_for(
    'static', filename='adminlte/css/adminlte.min.css') }}>
    <!-- overlayScrollbars -->
    <link rel="stylesheet" href={{ url_for(
    'static', filename='plugins/overlayScrollbars/css/OverlayScrollbars.min.css') }}>

</head>
<body class="hold-transition sidebar-mini layout-fixed layout-top-nav" data-panel-auto-height-mode="height">
<div class="wrapper">

    <!-- Navbar -->
    <nav class="main-header navbar navbar-expand navbar-white navbar-light">
        <ul class="navbar-nav ml-auto">
            <li class="nav-item">
                <a class="nav-link" onclick="window.location.href = '/index'">首页</a>
            </li>
            <li class="nav-item">
                <a class="nav-link" data-widget="fullscreen" href="#" role="button">
                    <i class="fas fa-expand-arrows-alt"></i>
                </a>
            </li>
        </ul>
    </nav>
    <!-- /.navbar -->

    <!-- Content Wrapper. Contains page content -->
    <!--    <div class="content-wrapper iframe-mode" data-widget="iframe" data-loading-screen="750">-->
    <div id="div-wrapper" class="content-wrapper iframe-mode" data-widget="iframe" data-loading-screen="750" data="{{info}}">
        <!--        <div class="nav navbar navbar-expand navbar-white navbar-light p-0">-->
        <!--        </div>-->
        <div class="tab-content">
            <div class="tab container">
                <div class="title" style="padding:20px;">
                    <h2 id='h-subject-res' class="display-4 text-center">结果!</h2>
                </div>
                <div class="card card-primary" style="margin:20px;">
                    <div class="card-header">
                        <h3 class="card-title">文件列表</h3>
                    </div>
                    <div class="card-body">
                        <div id="div-file" data="{{file_list}}">
                            <label id="label">需求文件</label>
                        </div>
                        <div id="div-res" class="form-group">
                            <label>结果文件</label>
                            <p id="p-res-file"></p>
                            <div class="row">
                                <button id="btn-open-file" type="button" class="btn btn-outline-primary btn-sm col-md-2">
                                    <i class="fa fa-file"></i>&ensp;打开文件
                                </button>&ensp;
                                <button id="btn-open-dir" type="button" class="btn btn-outline-primary btn-sm col-md-2">
                                    <i class="fa fa-folder-open"></i>&ensp;打开文件夹
                                </button>
                            </div>
                        </div>
                        <div id="div-loading" class="form-group" >
                            <div>
                                <h2 class="display-6">正在计算中<i class="fa fa-sync fa-spin"></i></h2>
                            </div>
                        </div>
                    </div>
            </div>
            </div>
        </div>
    </div>
    <!-- /.content-wrapper -->
    <footer class="main-footer">
        <strong>Copyright &copy; 2022 <a href="">Test</a>.</strong>
        All rights reserved.
        <div class="float-right d-none d-sm-inline-block">
            <b>Version</b> 1.0.0
        </div>
    </footer>

    <!-- Control Sidebar -->
    <!--    <aside class="control-sidebar control-sidebar-dark">-->
    <!--        &lt;!&ndash; Control sidebar content goes here &ndash;&gt;-->
    <!--    </aside>-->
    <!-- /.control-sidebar -->
</div>
<!-- ./wrapper -->

<!-- jQuery -->
<script src={{ url_for(
'static', filename='plugins/jquery/jquery.min.js') }}></script>
<!-- jQuery UI 1.11.4 -->
<script src={{ url_for(
'static', filename='plugins/jquery-ui/jquery-ui.min.js') }}></script>
<!-- Resolve conflict in jQuery UI tooltip with Bootstrap tooltip -->
<script>
    $.widget.bridge('uibutton', $.ui.button);

    // init
    const FILE_LIST_JSON = $('#div-file').attr('data');
    const FILE_LIST = eval(FILE_LIST_JSON);
    const INFO = eval($('#div-wrapper').attr('data'))[0];
    let subject_name = INFO['name'];
    let subject_type = INFO['subject_type'];
    $(document).attr('title',subject_name+'结果页');
    $('#h-subject-res').text(subject_name+'结果');
    for (let index in FILE_LIST) {
        $('#div-file').append($('<p></p>').text(FILE_LIST[index]['name']+": "+FILE_LIST[index]['path']));
    }
    // $('#div').text(subject_name+'结果');
   $('#div-loading').show();
   $('#div-res').hide();

    $.get('/transform/'+subject_type+'?file_list='+FILE_LIST_JSON, function (res) {
        let resJson = JSON.parse(res);
        if (resJson.success === true) {
            let resData = resJson.data;
            $('#p-res-file').text(resData['output_file']);
            $('#btn-open-file').click(function() {
                $.get('/open-dir?path='+resData['output_file']);
            });
            $('#btn-open-dir').click(function() {
                $.get('/open-dir?path='+resData['output_file_dir']);
            });
            $('#div-loading').hide();
            $('#div-res').show();
        }
    })
</script>
<!-- Bootstrap 4 -->
<script src={{ url_for(
'static', filename='plugins/bootstrap/js/bootstrap.bundle.min.js') }}></script>
<!-- overlayScrollbars -->
<script src={{ url_for(
'static', filename='plugins/overlayScrollbars/js/jquery.overlayScrollbars.min.js') }}></script>
<!-- AdminLTE App -->
<script src={{ url_for(
'static', filename='adminlte/js/adminlte.js') }}></script>
<!-- AdminLTE for demo purposes -->
<!--<script src="dist/js/demo.js"></script>-->
</body>
</html>
